{% extends 'accounts/main.html'%}

{% block content %}

{% include 'accounts/status.html' %}

<br>
<div class="row">
    <div class="col-md-5">
        <h5>CUSTOMERS:</h5>
        <hr>
        <div class="card card-body">
            <a class="btn btn-primary btn-sm btn-block" href="">Create Customer</a>
            <table class="table table-sm">
                <tr>
                    <th></th>
                    <th>Customer</th>
                    <th>Orders</th>
                </tr>
                {% for customer in customers %}
                <tr>
                    <td><a class="btn btn-sm btn-info" href="{% url 'customer' customer.id %}">View</a></td>
                    <td>{{customer.name}}</td>
                    <td>{{customer.phone}}</td>
                </tr>
                {% endfor%}
            </table>
        </div>
    </div>
    <div class="col-md-7">
        <h5>LAST 5 ORDERS</h5>
        <hr>
        <div class="card card-body">
            
            <table class="table table-sm">
                <tr>
                    <th>Products</th>
                    <th>Date Ordered</th>
                    <th>Status</th>
                    <th>Update</th>
                    <th>Remove</th>
                </tr>
                {% for order in orders %}
                <tr>
                    <td>{{order.product}}</td>
                    <td>{{order.date_created}}</td>
                    <td>{{order.status}}</td>
                    <td><a class="btn btn-sm btn-info" href="{% url 'update_order' order.id %}">Update</a></td>
                    <td><a class="btn btn-sm btn-danger" href="{% url 'delete_order' order.id %}">Delete</a></td>
                </tr>
                {% endfor%}
            </table>
        </div>
    </div>
</div>
{% endblock %}


   
